<template>
	<view class="container">
		<!-- 参考页面的卡片外层包裹样式 -->
		<view v-for="(card, index) in cardList" style="padding: 5rpx; background-color: #eee; margin-bottom: 10rpx;">
			<CardViewText :key="index" :title="card.title" :isTop="card.isTop" :author="card.author"
				:comments="card.comments" :time="card.time" :cardType="card.cardType" :image="card.image"
				:images="card.images" :adTag="card.adTag" :adInfo="card.adInfo" :showSearch="card.showSearch"
				:bgColor="card.bgColor || '#fff'">
				<!-- 启用插槽，参考页面的搜索插槽内容 -->
				<template v-slot:tips>
					<view class="slotcontent">
						<text>搜索：</text>
						<view class="borderbox"><text>今日头条</text></view>
						<view class="borderbox"><text>精选好物</text></view>
					</view>
				</template>
			</CardViewText>
		</view>
	</view>
</template>

<script>
	import CardViewText from '@/components/cardViewText.vue'
	export default {
		components: {
			CardViewText
		},
		data() {
			return {
				cardList: [{
						title: "中韩产业链深度合作 为区域发展注入强劲动力",
						isTop: true,
						author: "新华社",
						comments: 58,
						time: "2025.10.30",
						cardType: "text", 
						showSearch: false
					},
					{
						title: "习近平向亚太经合组织工商领导人峰会发表书面演讲",
						isTop: true,
						author: "人民日报",
						comments: 20,
						time: "2025.10.28",
						cardType: "image",
						image: "/static/news-img1.jpg", // 单张图片
						showSearch: true
					},
					{
						title: "老妇人随手购彩中2566万 彩票官方加赠暖心礼物",
						isTop: false,
						// author: "央视新闻",
						comments: 90,
						time: "2025.10.26",
						cardType: "ad", // 广告类型
						adTag: "广告 新闻",
						adInfo: "热点聚焦",
						images: [
							"/static/news-img1.jpg",
							"/static/news-img2.jpg",
							"/static/news-img1.jpg"
						],
						showSearch: false
					},
					// {
					// 	title: "数字经济成为经济增长新引擎",
					// 	isTop: false,
					// 	author: "经济日报",
					// 	comments: 34,
					// 	time: "2025.10.22",
					// 	cardType: "text-special",
					// 	showSearch: true // 显示搜索插槽
					// },
					{
						title: "绿色发展理念深入人心，生态文明建设成效显著",
						isTop: false,
						author: "光明日报",
						comments: 66,
						time: "2025.10.21",
						cardType: "image",
						image: "/static/news-img2.jpg",
						showSearch: false
					}
				]
			}
		},
		methods: {


		},

		computed: {

		},


	}
</script>

<style scoped>
	.container {
		background-color: #f5f5f5;
		min-height: 100vh;
		padding: 20rpx 0;
	}
	
		.slotcontent {
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: flex-start;
			text-align: center;
			padding-left: 10rpx;
			color: #aaf;
			font-size: 20rpx;
			margin-top: 15rpx;
		}
	
		.borderbox {
			margin: 0 10rpx;
			border-radius: 20rpx;
			border: 1rpx solid #aaf;
			padding: 5rpx 15rpx;
		}
	
		.borderbox text {
			color: #666;
			font-size: 22rpx;
		}
</style>